<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link type="text/css" rel="stylesheet" href="css/style.css" />
	<script src="http://47.106.66.89:8080/js/vue.min.js"></script>
	<script src="http://47.106.66.89:8080/js/axios.min.js"></script>
	<link  href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
	<script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
	<script src="/user/js/login.js"></script>
	<script src="/vcode/js/vcode.js"></script>
	<script src="/js/vote.js"></script>
</head>
<body>
<div id="app">
	<vote>
		<div id="vote" class="wrap">
			<h2>查看投票</h2>
			<ul class="list">
				<li>
					<h4>{{vote.vname}}</h4>
					<p class="info">共有 {{vote.items.length}} 个选项，
						已有 {{vote.userCnt}} 个网友参与了投票。</p>
					<ol>
						<li v-for="item in vote.items">{{item.iname}}
							<div class="rate">
								<div class="ratebg">
									<div class="percent"
										 :style="{width: item.rate+'%'}"></div>
								</div>
								<p>{{item.recordCnt}}票<span>({{item.rate}}%)</span></p>
							</div>
						</li>
					</ol>
					<div class="goback"><a href="index.html">返回投票列表</a></div>
				</li>
			</ul>
		</div>
	</vote>
</div>

<script>
	var v = new Vue({
		el:"#app",
		data:{
			vote:{items:[]},
		},
		created(){
			axios.get("/vote/tpVote/queryById" + location.search).then(res=>{
				this.vote = res.data;
				let sum = 0;
				this.vote.items.forEach(item=>{
					sum += item.recordCnt;
				});
				this.vote.items.forEach(item=>{
					item.rate = parseInt(item.recordCnt / sum * 100);
				})
			})
		},
	})
</script>
</body>
</html>
